﻿@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<style type="text/css">
    #default_view {
        border: 1px solid #000;
        margin: auto;
    }
    img { border:none;}
    .carousel {
        margin: auto;
    }
</style>

<div id="default_view"></div>

<div class="carousel" ><!-- This is the wrapping element -->
    <a href="http://en.wikipedia.org/wiki/Self-portrait_(Leonardo_da_Vinci)" target="_blank">
        <img src="/Images/carousel/Autobots.png" alt="Autobots"/>
    </a>
    <img id="Autobots" src="/Images/carousel/deception_sm.png" alt="deception_sm"/>
    <img src="/Images/carousel/Decepticons.png" alt="Decepticons"/>
    <img src="/Images/carousel/autobots_sm.png" alt="autobots_sm"/>

    @*<img src="/Images/carousel/Autobots.png" alt="Autobots"/>
    <img src="/Images/carousel/pic3.png" alt="Pic 3"/>
    <img src="/Images/carousel/pic4.png" alt="Pic 4"/>
    <img src="/Images/carousel/pic5.png" alt="Pic 5"/>
    <img src="/Images/carousel/pic6.png" alt="Pic 6"/>
    <img src="/Images/carousel/pic7.png" alt="Pic 7"/>
    <img src="/Images/carousel/pic8.png" alt="Pic 8"/>
    <img src="/Images/carousel/pic9.png" alt="Pic 9"/>*@
</div>

<script src="/JS/MyCool/myCarousel.js" type="text/javascript"></script>
<script type="text/javascript">
    var boardContent = [
        '/*****************************************************',
        '   Awesome Javascript Framework Portal',
        '   Using a bunch of Cutting Edge Techniques',
        '   Open Source Git&CodePlex  Author: Master HaKu',
        '   License:    GPLv3  Copy Right: 2013',
        '*****************************************************/'
    ];

    var board = new DepartureBoard(document.getElementById('default_view'), { rowCount: 6, letterCount: 55 });
    board.setValue(boardContent);
    
    /*
    window.setTimeout(function () {
        board.setValue('Author: Master HaKu');
    }, 12000);
    */
</script>

